<template>
    <div style=" position: relative;"><el-card>
            <div>
                <el-tabs  type="border-card" v-model="tabs_activeName" class="demo-tabs" @tab-click="handleClick">
                    <el-tab-pane label="我的托管" name="我的托管">
                        <keep-alive>
                            <my_hosting v-if="tabs_off == 0"></my_hosting>
                        </keep-alive>
                    </el-tab-pane>
                    <el-tab-pane label="托管给我" name="托管给我">
                        <keep-alive>
                            <hosting_my v-if="tabs_off == 1"></hosting_my>
                        </keep-alive>
                    </el-tab-pane>

                </el-tabs>
            </div>
        </el-card>
    </div>
</template>

<script setup>
import { ref, reactive, onMounted, computed, watch } from 'vue'
import { ElMessage, ElLoading, ElMessageBox } from 'element-plus'
import my_hosting from './my_hosting.vue'
import hosting_my from './hosting_my.vue'
onMounted(() => {
    tabs_activeName.value = '我的托管'
})

const tabs_activeName = ref('我的托管')
const tabs_off = ref(0)
const handleClick = (tab, event) => {
    if (tab.props.name == '托管给我') {
        tabs_off.value = 1
    } else {
        tabs_off.value = 0
    }
}
</script>

<style scoped lang='scss'>
.form_Css>.el-form-item {
    margin-right: 10px !important;
}

.div_map {
    position: relative;
    left: 0;
    top: 0;
}

.map_input {
    width: 100%;
    position: absolute;
    z-index: 1;
    display: flex;
    justify-content: center;

}

.map_input2 {
    width: 100%;
    position: absolute;
    z-index: 1;
    display: flex;
    justify-content: center;
    top: 34px;

}

.div_bg:hover {


    background-color: darkgray;
}
</style>

<style>
.el-table .el-table__cell {
    padding: 0px !important;
}



#tab-aircraft_deliver {
    color: red;
}

#tab-train_deliver {
    color: red;
}

#tab-bus_deliver {
    color: red;
}

.col-items::-webkit-scrollbar {
    width: 5px !important;
}

.col-items>label {
    margin-left: 0px !important;
    margin-top: 5px;
    width: 100%;
}
</style>
